<!-- vue 根据提示回车即可出现如下结构 -->
<template>
  <div>
    <!-- 2.把值赋值到标签 -->
    <h1>{{msg}}</h1>
    <p>{{obj.name}}</p>
    <i>{{obj.age >= 18 ? '成年了' : '未成年'}}</i><br> -->
   <span>{{obj.sex}}</span><br>
   <!-- v-bind:属性名  或简写  :属性名  绑定事件 -->
   <a v-bind:href="url">点击去百度</a>
   <img :src="imgUrl" alt="">
  </div>
</template>

<script>
export default {
  // 1.把变量在data函数上return的对象上
data(){
  return {
    msg:'Hello Vue',
    obj:{
      name:'vue',
      age:5,
      sex:'男'
    },
    url:'http://www.baidu.com',
    imgUrl:'https://img10.360buyimg.com/cms/jfs/t1/169156/34/29998/77710/6316b953E055dd5aa/b588002b059e8f17.jpg'
  }
},
}
</script>

<style>

</style>